import { AppstoreOutlined, MailOutlined, SettingOutlined } from '@ant-design/icons';
import React, { useState, useCallback, useMemo } from "react";
import { Menu, Divider, Row, Col, Carousel, Image, Radio, Space, Tabs } from 'antd';
import { Navigate, useNavigate, Route, Routes } from 'react-router-dom'
import Regcss from './Regcss.module.css'


import HomeChangeOne from './home_changeMenu/HomeChange1'
import HomeChangeTwo from './home_changeMenu/HomeChange2'
import HomeChangeThree from './home_changeMenu/HomeChange3'

const contentStyle = {
  height: '1600x',
  color: '#fff',
  lineHeight: '90px',
  textAlign: 'center',
};
//导航
function getItem(label, key) {
  return {
    key,
    label,
  };
}

const { TabPane } = Tabs;

function Home() {
  const [tabPosition, setTabPosition] = useState('left');

  const changeTabPosition = (e) => {
    setTabPosition(e.target.value);
  };




  return (
    <>
      {/* 轮播图 */}
      <Carousel autoplay>
        <div>
          <h3 style={contentStyle}>
            <Image
              src="https://mall.s.maizuo.com/ec15f7be2afc707f29cad4423809d9f7.jpg" preview={false} />
          </h3>
        </div>
        <div>
          <h3 style={contentStyle}>
            <Image
              src="https://mall.s.maizuo.com/ec15f7be2afc707f29cad4423809d9f7.jpg" preview={false} />
          </h3>
        </div>
        <div>
          <h3 style={contentStyle}>
            <Image
              src="https://mall.s.maizuo.com/ec15f7be2afc707f29cad4423809d9f7.jpg" preview={false} />
          </h3>
        </div>
        <div>
          <h3 style={contentStyle}>
            <Image
              src="https://mall.s.maizuo.com/ec15f7be2afc707f29cad4423809d9f7.jpg" preview={false} />
          </h3>
        </div>
      </Carousel>
      {/* 简介 */}
      <Row>
        <Col span={4}></Col>
        <Col span={18}>
          <div className={Regcss.chang}>
            <div className={Regcss.h1}>
              <h1>关于我们</h1>
            </div>
            <div className={Regcss.wenben}>
              <p>卖座网隶属于深圳市华宇讯科技有限公司 ，总部位于深圳，是一家集电影资讯、在线购票、用户互动社交、电影衍生品销售等服务的智慧电影互联网平台，提供全国超3500家影院在线选座购票服务。 已在广州、北京、上海、深圳、成都、长沙、南京、武汉、重庆开设分公司、办事处，2016年在全国共设立了20多个市场服务机构。 卖座网于2008年自主研发星辰电子影票系统，该系统具有独有的新型、便捷电 票系统，该系统具有独有的新型、便捷电影票务模式， 投入市场以来，得到了用户、合作影院的一致好评，市场影响力与日剧增。 正是由于在影院的强大影响力、独特便捷的购票模式和极具优势的独家价格 ，卖座网积极与多方合作，更从2008年开始，与腾讯携手合作，共同为亿万QQ会员用户提供优质的服务。2014年， 华谊兄弟以人民币2.66亿元投资卖座网，卖座网成华谊兄弟集团控股公司，是当前中国最大的电影O2O服务提供商 。</p>
            </div>
          </div>
        </Col>
      </Row>
      <Row gutter={[1, 1]} style={{ marginBottom: '100px' }}>
        <Col span={3}></Col>
        <Col xs={{ span: 5, offset: 1 }} xl={{ span: 5, offset: 1 }}>
          <Image src='https://mall.s.maizuo.com/bb4e79ef1de07aab2f8ed91b7fd7e731.jpg'
            className={Regcss.img} />
        </Col>
        <Col xs={{ span: 5, offset: 1 }} xl={{ span: 5, offset: 1 }}>
          <Image src='https://mall.s.maizuo.com/90b7581c565efdf1b3ed8127172d9c87.jpg'
            className={Regcss.img} />
        </Col>
        <Col xs={{ span: 5, offset: 1 }} xl={{ span: 5, offset: 1 }}>
          <Image src='https://mall.s.maizuo.com/e753ab0a0709ff8a7048da1c714c5e06.jpg'
            className={Regcss.img} />
        </Col>
      </Row>
      {/* 切换菜单 */}
      <Row>
        <Col span={4}></Col>
        <Col span={6}>
          <Tabs tabPosition={tabPosition}>
            <TabPane tab="使用帮助" key="1" >
              <div style={{ width: '700px' }}>
                <h1 style={{ color: '#222426', fontSize: '36px', marginBottom: '28px', fontWeight: '400' }}>使用帮助</h1>
                <ul>
                  <li>
                    <em>1</em>
                    <span>什么是卖座卡?</span>
                    <p>卖座卡是卖座网的金牌产品，是作为员工福利、赠送客户和回馈会员的理想选择，方便实用，服务尊享。适用于卖座网平台上可预订及支付的项目，包含电影票、影院小食、电影周边。</p>
                  </li>
                  <li>
                    <em>2</em>
                    <span>卖座卡可不可以延期?</span>
                    <p>卖座卡背面是印有有效期的，只能在有效期内使用 ，根据购卡协议目前暂不支持延期。</p>
                  </li>
                  <li>
                    <em>3</em>
                    <span >我买了某影城的订座票，但是临时有事不能去看可以退吗?</span>
                    <p>详情请见「退票服务」。</p>
                  </li>
                  <li>
                    <em >4</em>
                    <span>我有一张卖座网面额为100元的电影卡，请问可以去哪些影城使用?</span>
                    <p>在全国范围内，只要跟卖座网有合作的影城都可以使用。</p>
                  </li>
                  <li>
                    <em >5</em>
                    <span >公司刚发的卡，找不到了，请问怎么办?</span>
                    <p>建议您第一时间联系卖座客服4001808400进行挂失，避免资金流失。</p>
                  </li>
                </ul>
              </div>
            </TabPane>
            <TabPane tab="退票服务" key="2">
              <div style={{ width: '700px' }}>
                <h1 style={{ color: '#222426', fontSize: '36px', marginBottom: '28px', fontWeight: '400' }}>退票服务</h1>
                <span style={{ color: '#ff5f16', fontSize: '18px', fontWeight: '700' }}>一、卖座网仅提供因以下原因造成的用户退票：</span>
                <div style={{ fontSize: '14px', color: '#787878', fontWeight: '400' }}>
                  <p>1. 影院为卖座网支持退票服务的影院</p>
                  <p>2. 所退影票不属于特殊场次的影票（特殊场次会在购票时提示）</p>
                  <p>3. 单个用户ID票的手机号码每个月（自然月）申请退票的订单数不超过5笔；</p>
                  <p>4. 申请退票的影票未被取票；</p>
                  <p>5. 因影院售票系统原因造成的用户已完成付款但订单无法生成的（即订单状态为"不成功的）；</p>
                  <p>6. 因影院原因造成的影片排片信息、场次更换而使得用户无法正常观影的；</p>
                  <p>7. 因不可抗力或政府管制（如全国哀悼日，国家禁止娱乐活动的）造成用户无法正常观影的</p>
                </div>

                <span style={{ color: '#ff5f16', fontSize: '18px', fontWeight: '700' }}>二、用户同意以下卖座网的不予退款的条件及约定:</span>
                <div style={{ fontSize: '14px', color: '#787878', fontWeight: '400' }}>
                  <p>1. 订购成功，以收到短信，订单状态为"成功"为准，用户一旦购买成功，是订座票这种情况的，卖座网不接受任何退款或换票；</p>
                  <p>2. 卖座网或卖座网与合作方赠送的站内余额不作为退款范畴内；</p>
                  <p>3. 卖座卡充值等不作为退款范畴内；</p>
                  <p>4. 恶意用户及黄牛不支持退票，退票服务是为卖座网正常购票用户提供的服务，卖座网严禁用户恶意使用信用卡套现的行为，一经卖座网发现，卖座网有权冻结该用户账户，同时有权通报给该信用卡发卡单位；</p>
                  <p>5. 卖座网保留部分消费卡、银行卡支付，向用户索取支付手续费或第三方合作服务费的权利；</p>
                  <p>6. 用户遵守卖座网对退款的相关规定，并允许卖座网保留对规定更新或更改的权利。 以上退款原则涵盖于卖座网自由渠道以及合作渠道以及第三方代理机构，卖座网保留解释权。</p>
                </div>

                <span style={{ color: '#ff5f16', fontSize: '18px', fontWeight: '700' }}>三、申请退票方式:</span>

                <div style={{ fontSize: '14px', color: '#787878', fontWeight: '400' }}>
                  <p>1. 只接受用户电话退票申请，不接受其他退票申请方式；</p>
                  <p>2. 只限购票用户本人来电申请，卖座网将核对申请用户信息；</p>
                  <p>3. 拨打客服热线：400-1808-400，客服为您进行退票操作。</p>
                </div>

              </div>
            </TabPane>
            <TabPane tab="服务条款" key="3">
              <div style={{ width: '700px' }}>
                <h1 style={{ color: '#222426', fontSize: '36px', marginBottom: '28px', fontWeight: '400' }}>服务条款</h1>
                <span style={{ color: '#ff5f16', fontSize: '18px', fontWeight: '700' }}>一、服务条款的确定和接受</span>
                <div style={{ fontSize: '14px', color: '#787878', fontWeight: '400' }}>
                  <p>《服务条款》（以下简称"本条款"）由深圳市华宇讯科技有限公司在提供域名为 www.maizuo.com 卖座网的网站服务时与卖座网用户达成的关于使用卖座网的各项规则、条款和条件。用户点击"同意"选项完成注册，这表示用户已接受本服务条款，并与公司就本服务条款达成协议。</p>
                </div>

                <span style={{ color: '#ff5f16', fontSize: '18px', fontWeight: '700' }}>二、内容所有权及知识产权</span>
                <div style={{ fontSize: '14px', color: '#787878', fontWeight: '400' }}>
                  <p>1.卖座网提供的网络服务内容包括但不限于文字、软件、声音、图片、图表、视频等。所有这些内容受版权、商标和其他财产所有权法律的保护。</p>
                  <p>2.卖座网手机版及手机客户端的各种版本，包括但不限于wap版、Iphone版、Android版等，均援引适用本服务条款。卖座网拥有并保留其提供的各种手机客户端及在手机客户端中展示内容的全部知识产权。</p>
                  <p>3.用户只能在公司的授权下才能使用这些内容，而不能擅自复制、改造、创造与这些内容有关的派生产品。</p>
                </div>

                <span style={{ color: '#ff5f16', fontSize: '18px', fontWeight: '700' }}>三、用户服务的使用与停止使用</span>
                <div style={{ fontSize: '14px', color: '#787878', fontWeight: '400' }}>
                  <p>1.卖座网运用自己的操作系统通过国际互联网络为用户仅提供相关的网络服务。</p>
                  <p>用户必须:</p>
                  <p>(a) 自备与网络服务有关的设备（如电脑.调制解调器及其他与接入互联网有关的装置等）；</p>
                  <p>(b) 上网和其他获取此服务而支出所需的费用（如为接入互联网而支付的电话费及上网费等）均应由用户自行承担。</p>
                  <p>2.考虑到公司产品服务的重要性和商品属性。在使用卖座网服务时，用户同意：</p>
                  <p>(a) 注册时，提供及时、详尽及准确的个人资料；</p>
                  <p>(b) 用户名和昵称的注册与使用应符合网络道德，遵守中华人民共和国的相关法律法规；</p>
                  <p>(c) 用户名和昵称中不能含有威胁、淫秽、漫骂、非法、侵害他人权益等有争议性的文字；</p>
                  <p>(d) 如果用户提供的资料包含不当的信息，卖座网保留结束该用户使用服务资格的权利。</p>
                  <p>(e) 用户须对其账户中的所有行为、活动和事件负全责。</p>
                  <p>3.用户不得通过不正当手段恶意注册卖座网账号，不得盗用他人账号，不得泄露其他用户的相关信息。如用户违反上述规定，则卖座网有权直接采取一切必要的措施，包括但不限于删除用户发布的内容、暂停或查封用户账号，取消因违规所获利益，乃至通过诉讼形式追究用户法律责任等。</p>
                  <p> 4.用户有权随时对自己的个人资料进行查询、修改和删除；也可以停止使用旧的帐户重开一个新帐户；用户若发现任何非法使用用户账号或安全漏洞的情况，应当立即与卖座网联系。</p>
                </div>

              </div>
            </TabPane>
          </Tabs>

        </Col>
        <Col span={8}>

        </Col>
      </Row>
    </>
  )
}

export default Home